<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>ThinkPHP SocketLog服务</title>
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script>
        function makeid() {
            var text = "";
            var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

            for (var i = 0; i < 5; i++)
                text += possible.charAt(Math.floor(Math.random() * possible.length));

            return text;
        }

        function gen_client_id() {
            var c_id = 'tp' + makeid() + '_' + makeid();
            $('#client_id').html(c_id);
            $('#gen').show();
        }
    </script>
    <style>
        .bg {
            background: #1E88E5;
            padding: 100px;
            color: #fff;
        }
        
        .bg a {
            color: #fff;
        }
        
        .bg .info {
            font-size: 25px;
        }
        
        .btn-yellow {
            color: #fff;
            background: #ffab40;
            margin-top: 20px;
        }
        
        .box {
            width: 500px;
            margin: 0 auto;
        }
        
        .ps {
            margin: 20px auto;
            width: 500px;
        }
    </style>
</head>

<body>

    <a href="https://github.com/luofei614/SocketLog" target="_blank">
        <img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub">
    </a>
    <div class="bg">
        <div class="container text-center">
            <h1>ThinkPHP SocketLog服务</h1>
            <p class="info">调试程序、分析源码的好工具</p>
            <p>具体使用方法，请阅读GitHUb项目上的文档：<a href="http://github.com/luofei614" target="_blank">http://github.com/luofei614</a></p>
            <p>点击下方按钮，生成Client_id进行使用</p>
            <button class="btn btn-yellow" onclick="gen_client_id();">生成Client_ID</button>
        </div>
    </div>
    <!--/bg-->
    <br />
    <div id="gen" style="display:none;">
        <div class="alert alert-dark box" role="alert">
            <code>
                服务器地址：ws://slog.thinkphp.cn<br />
                client_id:<span id="client_id"></span>
            </code>
        </div>
        <p class="ps">
            免费服务，不保证服务稳定性，如对稳定性要求高，请查看GitHub项目页的服务端安装方法。
        </p>
    </div>
</body>

</html>